@import "@/styles/variables.scss";

.container_page {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100vw;
  background-color: #eff1f7;

  .header {
    background: $OVERALL_SITUATION_BACKGROUND;
    border-radius: 0 0 20rpx 20rpx;
    padding: 24rpx;
    font-size: 32rpx;
    margin-bottom: 24rpx;
    position: fixed;
    width: 100%;
    z-index: 2;

    // 搜索框搜索
    .search_bar {
      border-radius: 20rpx;
      padding: 12rpx 24rpx;
      background: white;
      display: flex;

      input {
        flex: 1;
      }

      .btn_search {
        margin-left: 24rpx;
      }
    }
  }

  .main {
    top: 152rpx;
    position: relative;
    background-color: #eff1f7;

    .card {
      background-color: white;
      border-radius: 20rpx;
      margin: 0 24rpx 24rpx;
      padding: 24rpx;
      position: relative;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;

      .title {
        font-size: 28rpx;
        color: #333;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100%;
      }

      .subTitle {
        color: #999;
        float: right;
      }

      .foldPane {
        padding: 12rpx 0;
        border-top: 2rpx solid #ddd;
        border-bottom: 2rpx solid #ddd;
        word-break: break-all;

        .label {
          font-size: 24rpx;
          color: #333;
          font-weight: bold;
        }

        .fold {
          max-height: 0;
        }

        .unfold {
          max-height: 200vh;
        }

        .content {
          border-radius: 20rpx;
          background-color: #eff1f7;
          overflow: hidden;
          transition: 0.2s;

          & > view {
            padding: 24rpx;
          }
        }
      }
    }
  }
}
